<template>
  <div class="user">
    <div class="module-header">
      <div class="module-prompt f-left">职工列表</div>
    </div>
    <el-table stripe ref="multipleTable" :data="userList" tooltip-effect="dark" style="width: 100%">
      <el-table-column prop="img" align="center" label="头像" width="140">
        <template slot-scope="scope">
          <img :src="scope.row.icon" alt="" style="height: 50px">
        </template>
      </el-table-column>
      <el-table-column v-for="(data,index) in userOpts" :key="index" :prop="data.field" :label="data.th" :formatter="data.format" align="center" :show-overflow-tooltip="true" :width="data.width">
      </el-table-column>
      <!-- 		<el-table-column
		label="操作"
		align="center"
		width="140">
		<template slot-scope="scope">
			<el-button type="text" size="mini" @click="handleEdit(scope.row)">考试详情</el-button>
		</template>
		</el-table-column> -->
    </el-table>
    <el-row :gutter="20" class="p-t-10" v-if="pageCount>1">
      <el-col :span="10" :offset="14">
        <el-pagination class="f-right" @current-change="handleCurrentChange" :current-page.sync="searchObj.page" :page-size="searchObj.size" :page-count="pageCount" background layout="prev, pager, next">
        </el-pagination>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import {
  userService
} from "api"
import {
  userOpts
} from "./user"
export default {
  data() {
    return {
      url: "",
      userList: [],
      userOpts,
      searchObj: {
        page: 1,
        size: 5
      },
      pageCount: 0,
      refreshList: 0
    }
  },
  methods: {
    handleCurrentChange() {
      this.refreshList++
    },
    getUserList() {
      let obj = {
        page: this.searchObj.page - 1,
        size: this.searchObj.size
      }
      console.log(obj)
      userService.getUserList(obj)
        .then(res => {
          this.userList = res.content
          this.pageCount = res.totalPages
        })
    },
    handleEdit(row) {
      this.$notify({
        message: '正在开发',
        type: 'warning'
      });
    }
  },
  mounted() {
    this.refreshList++
  },
  watch: {
    "refreshList": "getUserList"
  }
}

</script>
